<template>
  <div class="p-border-box p-page-break p-r"
       style="width: 76mm;height: 130mm;color: #000000;'font-family': 'Microsoft YaHei';background-color: white;font-size: 3mm;overflow: hidden">
    <!--到付-->
    <div class="p-a-c" v-if="item.websiteClearingWay===1">到付</div>
    <!--logo - 条形码-->
    <div class="p-flex p-b-b p-border-box" style="height: 14.6mm!important;">
      <div class="p-b-r p-border-box" style="width: 36mm;text-align: center">
        <img style="width: 30mm" src="../../../assets/print/huifutong.png" alt="logo"/>
        <div>时间 {{item.updateTime | formatDateMM}}</div>
      </div>
      <div>
        <div style="width: 40mm;height: 10.5mm">
          <!--<img class="p-fit" style="width: 40mm;height: 10.5mm" :src="$baseApi + item.waybillPath" alt="条形码">-->
          <js-barcode v-if="item.waybill" :number="item.waybill" width="40mm" height="10.5mm"/>
        </div>
        <div style="text-align: center;">{{item.waybill}}</div>
      </div>
    </div>
    <!--网点编号 - 网点名称-->
    <div class="p-b-b p-border-box" style="position: relative;height: 14mm!important;padding: 0 1mm;">
      <div style="position: absolute">
        <span
            style="line-height: 4mm">{{item.operationList | formatArray('currentUserName')}}—{{item.operationList | formatArray('sendToUserName')}}</span>
      </div>
      <div>
        <div style="position: relative;top: 1mm;height: 6mm;line-height: 4.5mm;font-size: 4.5mm;text-align: right;font-weight: bold;">
          {{item.operationList | formatArray('sendToName')}}
        </div>
        <div style="position: relative;top: 1mm;height: 6mm;line-height: 6.5mm;font-size: 4.5mm;text-align: right;font-weight: bold;">
          {{item.operationList | formatArray('laosSendToName')}}
        </div>
      </div>
    </div>
    <!--收件-->
    <div class="p-b-b p-border-box"
         style="height: 21mm!important;padding: 0 1mm;font-size: 3.5mm;line-height: 4mm">
      <span>收件：</span>
      <span style="margin-right: 3mm">{{item.receiverName}}</span>
      <span style="margin-right: 3mm">{{item.receiverPhone}}</span>
      <span>{{item.receiverAddress}}</span><br>
      <span>ຮັບເຄື່ອງ：</span>
      <span style="margin-right: 3mm">{{item.laosReceiverName}}</span>
      <span>{{item.receiverPhone}}</span><br>
      <span>{{item.laosReceiverAddress}}</span>
    </div>
    <!--寄件-->
    <div class="p-b-b p-border-box"
         style="height: 21mm!important;padding: 0 1mm;font-size: 3.5mm;line-height: 4mm">
      <span>寄件：</span>
      <span style="margin-right: 3mm">{{item.senderName}}</span>
      <span style="margin-right: 3mm">{{item.senderPhone}}</span>
      <span>{{item.senderAddress}}</span><br>
      <span>ຝາກເຄື່ອງ：</span>
      <span style="margin-right: 3mm">{{item.laosSenderName}}</span>
      <span>{{item.senderPhone}}</span><br>
      <span>{{item.laosSenderAddress}}</span>
    </div>
    <!--保价金额 - 总件数 - 重量-->
    <div class="p-flex p-b-b p-border-box" style="height: 5mm!important;padding: 0 1mm;">
      <div class="p-grow-1">保价金额:{{item.protectFee}}</div>
      <div class="p-grow-1">件数:{{item.insideCount}}</div>
    </div>
    <!--条形码 - 名称-->
    <div class="p-flex p-b-b p-border-box" style="height: 15mm!important;">
      <div style="width: 46mm">
        <div style="width: 46mm;height: 10.5mm;">
          <!--<img class="p-fit" style="width: 46mm;height: 10mm;margin-top: 1mm" :src="$baseApi + item.path" alt="条形码">-->
          <js-barcode v-if="item.number" :number="item.number" width="46mm" height="10mm" style="margin-top: 1mm"/>
        </div>
        <div style="text-align: center;">{{item.number}}</div>
      </div>
      <div style="width: 30mm;font-size: 3.8mm;line-height: 7mm;font-weight: bold;">
        <div>LYD Transport</div>
        <div>ຢຸນດາ ຂົນສົ່ງດ່ວນ</div>
      </div>
    </div>
    <!--各种信息-->
    <div class="p-b-b p-border-box" style="height: 8.5mm!important;padding: 0 1mm;line-height: 4mm">
      <div class="p-flex">
        <div class="p-grow-1">计费重量(/kg):{{item.weight}}</div>
        <div class="p-grow-1">运费:{{item.freight}}</div>
      </div>
      <div style="letter-spacing: 0">货物送达网点，经收件人或其代收人签字，视为送达</div>
    </div>
    <!--寄件 - 收件-->
    <div class="p-flex p-b-b p-border-box" style="height: 18mm!important;padding: 0 1mm">
      <div class="p-b-r p-border-box" style="width: 38mm">
        <span>寄件:</span>
        <span>{{item.senderName}} </span>
        <span>{{item.senderPhone}} </span>
        <span>{{item.beginPlace}}</span>
      </div>
      <div style="width: 38mm">
        <span>收件:</span>
        <span>{{item.receiverName}} </span>
        <span>{{item.receiverPhone}} </span>
        <span>{{item.receiverAddress}}</span>
      </div>
    </div>
    <!--内件品 - LYD-->
    <div class="p-flex" style="height: 12mm!important;padding-left: 1mm">
      <div class="p-b-r p-border-box" style="line-height: 4mm;width: 60mm">
        <div>收件人/代收人:</div>
        <div>签收时间:</div>
        <div class="p-flex">
          <div class="p-grow-1">备注：</div>
          <div class="p-grow-1">内件品名:{{item.articleName}}(已验视)</div>
        </div>
      </div>
      <div style="width: 16mm;font-size: 7mm;font-weight: bold; text-align: center;line-height: 12.6mm">
        LYD
      </div>
    </div>
  </div>
</template>

<script>
  import JsBarcode from '../components/JsBarcode'

  export default {
    name: "Fu",
    components: {JsBarcode},
    props: {
      item: {}
    }
  }
</script>
